/* border */
.border {
    background-repeat: no-repeat;
}
.border._t {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0);
    background-position: top;
    background-size: 100% 1px;
}
.border._r {
    background-image: linear-gradient(270deg, #ddd 50%, transparent 0);
    background-position: right;
    background-size: 1px 100%;
}
.border._b {
    background-image: linear-gradient(0deg, #ddd 50%, transparent 0);
    background-position: bottom;
    background-size: 100% 1px;
}
.border._l {
    background-image: linear-gradient(90deg, #ddd 49%, transparent 0); /* why49? */
    background-position: left;
    background-size: 1px 100%;
}
.border._a {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(270deg, #ddd 50%, transparent 0), linear-gradient(0deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: top, right, bottom, left;
    background-size: 100% 1px, 1px 100%, 100% 1px, 1px 100%;
}
.border._t._r {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(270deg, #ddd 50%, transparent 0);
    background-position: top, right;
    background-size: 100% 1px, 1px 100%;
}
.border._t._b {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(0deg, #ddd 50%, transparent 0);
    background-position: top, bottom;
    background-size: 100% 1px, 100% 1px;
}
.border._t._l {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: top, left;
    background-size: 100% 1px, 1px 100%;
}
.border._r._b {
    background-image: linear-gradient(270deg, #ddd 50%, transparent 0), linear-gradient(0deg, #ddd 50%, transparent 0);
    background-position: right, bottom;
    background-size: 1px 100%, 100% 1px;
}
.border._r._l {
    background-image: linear-gradient(270deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: right, left;
    background-size: 1px 100%, 1px 100%;
}
.border._b._l {
    background-image: linear-gradient(0deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: bottom, left;
    background-size: 100% 1px, 1px 100%;
}
.border._t._r._b {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(270deg, #ddd 50%, transparent 0), linear-gradient(0deg, #ddd 50%, transparent 0);
    background-position: top, right, bottom;
    background-size: 100% 1px, 1px 100%, 100% 1px;
}
.border._t._r._l {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(270deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: top, right, left;
    background-size: 100% 1px, 1px 100%, 1px 100%;
}
.border._r._b._l {
    background-image: linear-gradient(270deg, #ddd 50%, transparent 0), linear-gradient(0deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: right, bottom, left;
    background-size: 1px 100%, 100% 1px, 1px 100%;
}
.border._b._l._t {
    background-image: linear-gradient(180deg, #ddd 50%, transparent 0), linear-gradient(0deg, #ddd 50%, transparent 0), linear-gradient(90deg, #ddd 49%, transparent 0);
    background-position: top, bottom, left;
    background-size: 100% 1px, 100% 1px, 1px 100%;
}

/* /border */

/* 栅格 */
.m-row {
    position: relative;
    box-sizing: border-box;
}
.m-row:after, .m-row:before {
    display: table;
    content: "";
}
.m-row:after {
    clear: both;
}
.m-col-1, .m-col-2, .m-col-3, .m-col-4, .m-col-5, .m-col-6, .m-col-7, .m-col-8, .m-col-9, .m-col-10, .m-col-11, .m-col-12, .m-col-13, .m-col-14, .m-col-15, .m-col-16, .m-col-17, .m-col-18, .m-col-19, .m-col-20, .m-col-21, .m-col-22, .m-col-23, .m-col-24 {
    float: left;
    box-sizing: border-box;
}
.m-row.gutter-2 {
    margin-left: -1px;
    margin-right: -1px;
}
.m-row.gutter-2 >.m-col-1, .m-row.gutter-2 >.m-col-2, .m-row.gutter-2 >.m-col-3, .m-row.gutter-2 >.m-col-4, .m-row.gutter-2 >.m-col-5, .m-row.gutter-2 >.m-col-6, .m-row.gutter-2 >.m-col-7, .m-row.gutter-2 >.m-col-8, .m-row.gutter-2 >.m-col-9, .m-row.gutter-2 >.m-col-10, .m-row.gutter-2 >.m-col-11, .m-row.gutter-2 >.m-col-11, .m-row.gutter-2 >.m-col-12, .m-row.gutter-2 >.m-col-13, .m-row.gutter-2 >.m-col-14, .m-row.gutter-2 >.m-col-15, .m-row.gutter-2 >.m-col-16, .m-row.gutter-2 >.m-col-17, .m-row.gutter-2 >.m-col-18, .m-row.gutter-2 >.m-col-19, .m-row.gutter-2 >.m-col-20, .m-row.gutter-2 >.m-col-21, .m-row.gutter-2 >.m-col-22, .m-row.gutter-2 >.m-col-23, .m-row.gutter-2 >.m-col-24 {
    padding-left: 1px;
    padding-right: 1px;
}
.m-row.gutter-4 {
    margin-left: -2px;
    margin-right: -2px;
}
.m-row.gutter-4 >.m-col-1, .m-row.gutter-4 >.m-col-2, .m-row.gutter-4 >.m-col-3, .m-row.gutter-4 >.m-col-4, .m-row.gutter-4 >.m-col-5, .m-row.gutter-4 >.m-col-6, .m-row.gutter-4 >.m-col-7, .m-row.gutter-4 >.m-col-8, .m-row.gutter-4 >.m-col-9, .m-row.gutter-4 >.m-col-10, .m-row.gutter-4 >.m-col-11, .m-row.gutter-4 >.m-col-11, .m-row.gutter-4 >.m-col-12, .m-row.gutter-4 >.m-col-13, .m-row.gutter-4 >.m-col-14, .m-row.gutter-4 >.m-col-15, .m-row.gutter-4 >.m-col-16, .m-row.gutter-4 >.m-col-17, .m-row.gutter-4 >.m-col-18, .m-row.gutter-4 >.m-col-19, .m-row.gutter-4 >.m-col-20, .m-row.gutter-4 >.m-col-21, .m-row.gutter-4 >.m-col-22, .m-row.gutter-4 >.m-col-23, .m-row.gutter-4 >.m-col-24 {
    padding-left: 2px;
    padding-right: 2px;
}
.m-row.gutter-10 {
    margin-left: -5px;
    margin-right: -5px;
}
.m-row.gutter-10 >.m-col-1, .m-row.gutter-10 >.m-col-2, .m-row.gutter-10 >.m-col-3, .m-row.gutter-10 >.m-col-4, .m-row.gutter-10 >.m-col-5, .m-row.gutter-10 >.m-col-6, .m-row.gutter-10 >.m-col-7, .m-row.gutter-10 >.m-col-8, .m-row.gutter-10 >.m-col-9, .m-row.gutter-10 >.m-col-10, .m-row.gutter-10 >.m-col-11, .m-row.gutter-10 >.m-col-11, .m-row.gutter-10 >.m-col-12, .m-row.gutter-10 >.m-col-13, .m-row.gutter-10 >.m-col-14, .m-row.gutter-10 >.m-col-15, .m-row.gutter-10 >.m-col-16, .m-row.gutter-10 >.m-col-17, .m-row.gutter-10 >.m-col-18, .m-row.gutter-10 >.m-col-19, .m-row.gutter-10 >.m-col-20, .m-row.gutter-10 >.m-col-21, .m-row.gutter-10 >.m-col-22, .m-row.gutter-10 >.m-col-23, .m-row.gutter-10 >.m-col-24 {
    padding-left: 5px;
    padding-right: 5px;
}
.m-row.gutter-20 {
    margin-left: -10px;
    margin-right: -10px;
}
.m-row.gutter-20 >.m-col-1, .m-row.gutter-20 >.m-col-2, .m-row.gutter-20 >.m-col-3, .m-row.gutter-20 >.m-col-4, .m-row.gutter-20 >.m-col-5, .m-row.gutter-20 >.m-col-6, .m-row.gutter-20 >.m-col-7, .m-row.gutter-20 >.m-col-8, .m-row.gutter-20 >.m-col-9, .m-row.gutter-20 >.m-col-10, .m-row.gutter-20 >.m-col-11, .m-row.gutter-20 >.m-col-11, .m-row.gutter-20 >.m-col-12, .m-row.gutter-20 >.m-col-13, .m-row.gutter-20 >.m-col-14, .m-row.gutter-20 >.m-col-15, .m-row.gutter-20 >.m-col-16, .m-row.gutter-20 >.m-col-17, .m-row.gutter-20 >.m-col-18, .m-row.gutter-20 >.m-col-19, .m-row.gutter-20 >.m-col-20, .m-row.gutter-20 >.m-col-21, .m-row.gutter-20 >.m-col-22, .m-row.gutter-20 >.m-col-23, .m-row.gutter-20 >.m-col-24 {
    padding-left: 10px;
    padding-right: 10px;
}
.m-row.gutter-30 {
    margin-left: -15px;
    margin-right: -15px;
}
.m-row.gutter-30 >.m-col-1, .m-row.gutter-15 >.m-col-2, .m-row.gutter-15 >.m-col-3, .m-row.gutter-15 >.m-col-4, .m-row.gutter-15 >.m-col-5, .m-row.gutter-15 >.m-col-6, .m-row.gutter-15 >.m-col-7, .m-row.gutter-15 >.m-col-8, .m-row.gutter-15 >.m-col-9, .m-row.gutter-15 >.m-col-10, .m-row.gutter-15 >.m-col-11, .m-row.gutter-15 >.m-col-11, .m-row.gutter-15 >.m-col-12, .m-row.gutter-15 >.m-col-13, .m-row.gutter-15 >.m-col-14, .m-row.gutter-15 >.m-col-15, .m-row.gutter-15 >.m-col-16, .m-row.gutter-15 >.m-col-17, .m-row.gutter-15 >.m-col-18, .m-row.gutter-15 >.m-col-19, .m-row.gutter-15 >.m-col-20, .m-row.gutter-15 >.m-col-21, .m-row.gutter-15 >.m-col-22, .m-row.gutter-15 >.m-col-23, .m-row.gutter-15 >.m-col-24 {
    padding-left: 15px;
    padding-right: 15px;
}
.m-row.gutter-40 {
    margin-left: -20px;
    margin-right: -20px;
}
.m-row.gutter-40 >.m-col-1, .m-row.gutter-20 >.m-col-2, .m-row.gutter-20 >.m-col-3, .m-row.gutter-20 >.m-col-4, .m-row.gutter-20 >.m-col-5, .m-row.gutter-20 >.m-col-6, .m-row.gutter-20 >.m-col-7, .m-row.gutter-20 >.m-col-8, .m-row.gutter-20 >.m-col-9, .m-row.gutter-20 >.m-col-10, .m-row.gutter-20 >.m-col-11, .m-row.gutter-20 >.m-col-11, .m-row.gutter-20 >.m-col-12, .m-row.gutter-20 >.m-col-13, .m-row.gutter-20 >.m-col-14, .m-row.gutter-20 >.m-col-15, .m-row.gutter-20 >.m-col-16, .m-row.gutter-20 >.m-col-17, .m-row.gutter-20 >.m-col-18, .m-row.gutter-20 >.m-col-19, .m-row.gutter-20 >.m-col-20, .m-row.gutter-20 >.m-col-21, .m-row.gutter-20 >.m-col-22, .m-row.gutter-20 >.m-col-23, .m-row.gutter-20 >.m-col-24 {
    padding-left: 20px;
    padding-right: 20px;
}
.m-row.gutter-50 {
    margin-left: -25px;
    margin-right: -25px;
}
.m-row.gutter-50 >.m-col-1, .m-row.gutter-25 >.m-col-2, .m-row.gutter-25 >.m-col-3, .m-row.gutter-25 >.m-col-4, .m-row.gutter-25 >.m-col-5, .m-row.gutter-25 >.m-col-6, .m-row.gutter-25 >.m-col-7, .m-row.gutter-25 >.m-col-8, .m-row.gutter-25 >.m-col-9, .m-row.gutter-25 >.m-col-10, .m-row.gutter-25 >.m-col-11, .m-row.gutter-25 >.m-col-11, .m-row.gutter-25 >.m-col-12, .m-row.gutter-25 >.m-col-13, .m-row.gutter-25 >.m-col-14, .m-row.gutter-25 >.m-col-15, .m-row.gutter-25 >.m-col-16, .m-row.gutter-25 >.m-col-17, .m-row.gutter-25 >.m-col-18, .m-row.gutter-25 >.m-col-19, .m-row.gutter-25 >.m-col-25, .m-row.gutter-25 >.m-col-21, .m-row.gutter-25 >.m-col-22, .m-row.gutter-25 >.m-col-23, .m-row.gutter-25 >.m-col-24 {
    padding-left: 25px;
    padding-right: 25px;
}
.m-row.gutter-60 {
    margin-left: -30px;
    margin-right: -30px;
}
.m-row.gutter-60 >.m-col-1, .m-row.gutter-30 >.m-col-2, .m-row.gutter-30 >.m-col-3, .m-row.gutter-30 >.m-col-4, .m-row.gutter-30 >.m-col-5, .m-row.gutter-30 >.m-col-6, .m-row.gutter-30 >.m-col-7, .m-row.gutter-30 >.m-col-8, .m-row.gutter-30 >.m-col-9, .m-row.gutter-30 >.m-col-10, .m-row.gutter-30 >.m-col-11, .m-row.gutter-30 >.m-col-11, .m-row.gutter-30 >.m-col-12, .m-row.gutter-30 >.m-col-13, .m-row.gutter-30 >.m-col-14, .m-row.gutter-30 >.m-col-15, .m-row.gutter-30 >.m-col-16, .m-row.gutter-30 >.m-col-17, .m-row.gutter-30 >.m-col-18, .m-row.gutter-30 >.m-col-19, .m-row.gutter-30 >.m-col-30, .m-row.gutter-30 >.m-col-21, .m-row.gutter-30 >.m-col-22, .m-row.gutter-30 >.m-col-23, .m-row.gutter-30 >.m-col-24 {
    padding-left: 30px;
    padding-right: 30px;
}
.m-col-1 {
    width: 4.16667%;
}
.m-col-offset-1 {
    margin-left: 4.16667%;
}
.m-col-2 {
    width: 8.33333%;
}
.m-col-offset-2 {
    margin-left: 8.33333%;
}
.m-col-3 {
    width: 12.5%;
}
.m-col-offset-3 {
    margin-left: 12.5%;
}
.m-col-4 {
    width: 16.66667%;
}
.m-col-offset-4 {
    margin-left: 16.66667%;
}
.m-col-5 {
    width: 20.83333%;
}
.m-col-offset-5 {
    margin-left: 20.83333%;
}
.m-col-6 {
    width: 25%;
}
.m-col-offset-6 {
    margin-left: 25%;
}
.m-col-7 {
    width: 29.16667%;
}
.m-col-offset-7 {
    margin-left: 29.16667%;
}
.m-col-8 {
    width: 33.33333%;
}
.m-col-offset-8 {
    margin-left: 33.33333%;
}
.m-col-9 {
    width: 37.5%;
}
.m-col-offset-9 {
    margin-left: 37.5%;
}
.m-col-10 {
    width: 41.66667%;
}
.m-col-offset-10 {
    margin-left: 41.66667%;
}
.m-col-11 {
    width: 45.83333%;
}
.m-col-offset-11 {
    margin-left: 45.83333%;
}
.m-col-12 {
    width: 50%;
}
.m-col-offset-12 {
    margin-left: 50%;
}
.m-col-13 {
    width: 54.16667%;
}
.m-col-offset-13 {
    margin-left: 54.16667%;
}
.m-col-14 {
    width: 58.33333%;
}
.m-col-offset-14 {
    margin-left: 58.33333%;
}
.m-col-15 {
    width: 62.5%;
}
.m-col-offset-15 {
    margin-left: 62.5%;
}
.m-col-16 {
    width: 66.66667%;
}
.m-col-offset-16 {
    margin-left: 66.66667%;
}
.m-col-17 {
    width: 70.83333%;
}
.m-col-offset-17 {
    margin-left: 70.83333%;
}
.m-col-18 {
    width: 75%;
}
.m-col-offset-18 {
    margin-left: 75%;
}
.m-col-19 {
    width: 79.16667%;
}
.m-col-offset-19 {
    margin-left: 79.16667%;
}
.m-col-20 {
    width: 83.33333%;
}
.m-col-offset-20 {
    margin-left: 83.33333%;
}
.m-col-21 {
    width: 87.5%;
}
.m-col-offset-21 {
    margin-left: 87.5%;
}
.m-col-22 {
    width: 91.66667%;
}
.m-col-offset-22 {
    margin-left: 91.66667%;
}
.m-col-23 {
    width: 95.83333%;
}
.m-col-offset-23 {
    margin-left: 95.83333%;
}
.m-col-24 {
    width: 100%;
}
.m-col-offset-24 {
    margin-left: 100%;
}

/* /栅格 */